<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
      lang="#{trdBn.localeUrlCode}">
    <h:head>
        <title>#{trdBn.pageTitle}</title>
        <link rel="icon" href="/favicon.ico"/>
        <meta lang="#{mainMenuBean.localeUrlCode}"/>
        <meta name="keywords" content="#{trdBn.keyWords}"/>
        <meta name="description" content="#{trdBn.description}"/>
        <meta property="og:title" content="TrendEconomy"/>
        <meta property="og:url" content="http://trendeconomy.com"/>
        <meta property="og:image" content="#{mainMenuBean.httpHeader}/resources/images/og_#{mainMenuBean.localeUrlCode}.png"/>
        <meta property="og:image:width" content="1000"/>
        <meta property="og:image:height" content="500"/>
        <meta property="og:type" content="article"/>
        <meta property="og:description" content="#{trdBn.pageTitle}"/>
        <link rel="stylesheet" type="text/css" href="/resources/css/gew2.min.css"/>
        <link rel="stylesheet" type="text/css" href="/resources/fa/css/font-awesome.min.css"/>
        <script type="text/javascript" src="/resources/js/jquery-1.11.2.min.js"></script>
        <script type="text/javascript" src="/resources/js/jquery.mobile.custom.min.js"></script>
        <script type="text/javascript" src="/resources/js/jquery-ui.min.js"></script>
        <script type="text/javascript" src="/resources/js/raphael.js"></script>
        <script type="text/javascript" src="/resources/js/gw.min02.js"></script>
        <script type="text/javascript" src="/resources/js/d3.js"></script>
        <script type="text/javascript" src="/resources/js/gwSunburst.min.js"></script>
        <script type="text/javascript" src="#{trdBn.dynamicJsUrl}"></script>
        <link rel="alternate" hreflang="x-default" href="#{mainMenuBean.urlEn}" />
        <link rel="alternate" hreflang="#{mainMenuBean.hrefLangEn}" href="#{mainMenuBean.urlEn}" />
        <link rel="alternate" hreflang="#{mainMenuBean.hrefLangRu}" href="#{mainMenuBean.urlRu}" />
    </h:head>
    <h:body>
        <ui:include src="/const/ga.html"/>
        <ui:include src="/pages.min/header.xhtml"/>
        <div>

            <div style="display:table-row;height:4px;"></div>
            <div class="gw-wdth">
                <div style="display:table-cell;min-width:250px;max-width:300px;width:25%;height:1px;margin:5px;vertical-align:top;">
                    <div class="gw-block-header">
                        <div class="gw-hdr-btn gw-info"><div class="gw-balloon-content"><div class="gw-bll" style="max-width:250px;"><ui:include src="../const/info_reporter_#{trdBn.localeUrlCode}.html"/></div></div></div>
                        <h2 class="gw-hdr-trd">#{trdBn.UI_TITLE_REPORTERS}</h2>
                        <div class="gw-hdr-btn gw-srch">
                            <div class="gw-pp" style="max-height:400px;max-width:250px;overflow:auto;" gw-id="#{bnPrm.REPORTER_IDS}">
                                <div class="gw-tree" gw-url-load-init="#{trdBn.inclTreeReporterInit}" gw-url-load-children="#{trdBn.inclTreeReporterChildren}" gw-url-load-search="#{trdBn.inclTreeReporterSearch}">
                                    <div class="gw-search"><input class="gw-search-text" type="text"/>
                                        <div class="gw-tree-cell gw-search-button"></div>
                                        <div class="gw-tree-cell gw-search-progress"></div>
                                        <div class="gw-tree-cell gw-search-clear"></div>
                                    </div>
                                    <div class="gw-search-results" style="min-height:100px;"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <c:forEach items="#{trdBn.reporters}" var="d">
                        <div class="gw-table-row gw-table-row-hl">
                            <div class="gw-tree-cell"><div class="gw-tree-active-border1"><div class="gw-tree-cell-selected1"/></div></div>
                            <div class="gw-tree-cell">#{d.name}</div>
                        </div>
                    </c:forEach>

                    <div class="gw-block-header">
                        <div class="gw-hdr-btn gw-info"><div class="gw-balloon-content"><div class="gw-bll" style="max-width:250px;"><ui:include src="../const/info_trade_flow_#{trdBn.localeUrlCode}.html"/></div></div></div>
                        <h2 class="gw-hdr-trd">#{trdBn.UI_TITLE_TRADE_FLOW}</h2>
                        <div class="gw-hdr-btn gw-srch" style="color:transparent;cursor:default;"></div>
                    </div>
                    <div class="gw-tree" gw-url-load-init="#{trdBn.inclTreeTradeFlowInit}" gw-url-load-children="#{trdBn.inclTreeTradeFlowChildren}" gw-url-load-search="#{trdBn.inclTreeTradeFlowSearch}">
                        <div class="gw-search" style="display:none;"></div>
                    </div>

                    <div class="gw-block-header">
                        <div class="gw-hdr-btn gw-info"><div class="gw-balloon-content"><div class="gw-bll" style="max-width:250px;"><ui:include src="../const/info_partner_#{trdBn.localeUrlCode}.html"/></div></div></div>
                        <h1 class="gw-hdr-trd">#{trdBn.UI_TITLE_PARTNER}</h1>
                        <div class="gw-hdr-btn gw-srch">
                            <div class="gw-pp" style="max-height:400px;max-width:250px;overflow:auto;" gw-id="#{bnPrm.PARTNER_IDS}">
                                <div class="gw-tree" gw-url-load-init="#{trdBn.inclTreePartnerInit}" gw-url-load-children="#{trdBn.inclTreePartnerChildren}" gw-url-load-search="#{trdBn.inclTreePartnerSearch}">
                                    <div class="gw-search"><input class="gw-search-text" type="text"/>
                                        <div class="gw-tree-cell gw-search-button"></div>
                                        <div class="gw-tree-cell gw-search-progress"></div>
                                        <div class="gw-tree-cell gw-search-clear"></div>
                                    </div>
                                    <div class="gw-search-results" style="min-height:100px;"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <c:forEach items="#{trdBn.partners}" var="d">
                        <a href="#{trdBn.getSelectedPartnerUrl(d.urlCode)}" class="gw-table-row gw-table-row-hl">
                            <div class="gw-tree-cell"><div class="gw-tree-active-border1"><div class="gw-tree-cell-selected1"/></div></div>
                            <div class="gw-tree-cell">#{d.name}</div>
                        </a>
                    </c:forEach>

                    <div class="gw-block-header">
                        <div class="gw-hdr-btn gw-info"><div class="gw-balloon-content"><div class="gw-bll" style="max-width:250px;"><ui:include src="../const/info_period_#{trdBn.localeUrlCode}.html"/></div></div></div>
                        <h2 class="gw-hdr-trd">#{trdBn.UI_TITLE_PERIOD}</h2>
                        <div class="gw-hdr-btn gw-srch">
                            <div class="gw-pp" style="max-height:400px;max-width:250px;overflow:auto;" gw-id="#{bnPrm.PERIOD_IDS}">
                                <div class="gw-tree" gw-url-load-init="#{trdBn.inclTreePeriodInit}" gw-url-load-children="#{trdBn.inclTreePeriodChildren}" gw-url-load-search="#{trdBn.inclTreePeriodSearch}">
                                    <div class="gw-search"><input class="gw-search-text" type="text"/>
                                        <div class="gw-tree-cell gw-search-button"></div>
                                        <div class="gw-tree-cell gw-search-progress"></div>
                                        <div class="gw-tree-cell gw-search-clear"></div>
                                    </div>
                                    <div class="gw-search-results" style="min-height:100px;"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <c:forEach items="#{trdBn.periods}" var="d">
                        <a href="#{trdBn.getSelectedPeriodUrl(d.urlCode)}" class="gw-table-row gw-table-row-hl">
                            <div class="gw-tree-cell"><div class="gw-tree-active-border1"><div class="gw-tree-cell-selected1"/></div></div>
                            <div class="gw-tree-cell">#{d.name}</div>
                        </a>
                    </c:forEach>

                    <div class="gw-block-header">
                        <div class="gw-hdr-btn gw-info"><div class="gw-balloon-content"><div class="gw-bll" style="max-width:250px;"><ui:include src="../const/info_classification_#{trdBn.localeUrlCode}.html"/></div></div></div>
                        <h2 class="gw-hdr-trd">#{trdBn.UI_TITLE_COMMODITY_CLASSIFICATION}</h2>
                        <div class="gw-hdr-btn gw-srch">
                            <div class="gw-pp" style="max-height:400px;max-width:250px;overflow:auto;" gw-id="#{bnPrm.COMMODITY_GROUP_TYPE_IDS}">
                                <div class="gw-tree" gw-url-load-init="#{trdBn.inclTreeClassificationInit}" gw-url-load-children="#{trdBn.inclTreeClassificationChildren}" gw-url-load-search="#{trdBn.inclTreeClassificationSearch}">
                                    <div class="gw-search"><input class="gw-search-text" type="text"/>
                                        <div class="gw-tree-cell gw-search-button"></div>
                                        <div class="gw-tree-cell gw-search-progress"></div>
                                        <div class="gw-tree-cell gw-search-clear"></div>
                                    </div>
                                    <div class="gw-search-results" style="min-height:100px;"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <c:forEach items="#{trdBn.classifications}" var="d">
                        <div class="gw-table-row gw-table-row-hl">
                            <div class="gw-tree-cell"><div class="gw-tree-active-border1"><div class="gw-tree-cell-selected1"/></div></div>
                            <div class="gw-tree-cell">#{d.name}</div>
                        </div>
                    </c:forEach>

                    <div class="gw-block-header">
                        <div class="gw-hdr-btn gw-info"><div class="gw-balloon-content"><div class="gw-bll" style="max-width:250px;"><ui:include src="../const/info_commodity_#{trdBn.localeUrlCode}.html"/></div></div></div>
                        <h2 class="gw-hdr-trd">#{trdBn.UI_TITLE_COMMODITY}</h2>
                        <div class="gw-hdr-btn gw-srch">
                            <div class="gw-pp" style="max-height:400px;max-width:400px;overflow:auto;" gw-id="#{bnPrm.COMMODITY_IDS}">
                                <div class="gw-tree" gw-url-load-init="#{trdBn.inclTreeCommodityInit}" gw-url-load-children="#{trdBn.inclTreeCommodityChildren}" gw-url-load-search="#{trdBn.inclTreeCommoditySearch}">
                                    <div class="gw-search"><input class="gw-search-text" type="text"/>
                                        <div class="gw-tree-cell gw-search-button"></div>
                                        <div class="gw-tree-cell gw-search-progress"></div>
                                        <div class="gw-tree-cell gw-search-clear"></div>
                                    </div>
                                    <div class="gw-search-results" style="min-height:100px;"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <c:forEach items="#{trdBn.commodities}" var="d">
                        <a href="#{trdBn.getSelectedCommodityUrl(d.urlCode)}" class="gw-table-row gw-table-row-hl">
                            <div class="gw-tree-cell"><div class="gw-tree-active-border1"><div class="gw-tree-cell-selected1"/></div></div>
                            <h1 class="gw-tree-cell" style="font-weight:normal;text-align:left;">(<b>#{d.code}</b>) #{d.name}</h1>
                        </a>
                    </c:forEach>

                </div>
                <div style="display:table-cell;width:73%;height:1px;margin:5px;vertical-align:top;">
                    <div class="gw-block-header" style="text-align:left;">
                        <div style="display:inline-block;vertical-align:top;">
                            <a href="#{trdBn.tradeSummaryUrl}" class="gw-hdr-btn gw-lvlup">
                                <div class="gw-balloon-content">
                                    <div class="gw-bll" style="max-width:200px;">#{trdBn.tradeSummaryShortTitle}</div>
                                </div>
                            </a>
                        </div>
                        <h1 class="gw-hdr-trd" style="width:95%;">#{trdBn.pageTitleShort}</h1>
                    </div>
                    <div style="height:28px;">
                        <div class="gw-slct" gw-onchange="onFilterChanged" gw-prm="#{bnPrm.TRADE_FLOW_IDS}">
                            <div><div class="gw-slct-vl"></div><div class="gw-slct-btn"></div></div>
                            <div class="gw-slct-cnt">
                                <c:forEach items="#{trdBn.tradeFlows}" var="d">
                                    <div class="gw-slct-opt gw-table-row gw-table-row-hl" gw-id="#{d.urlCode}">
                                        <div class="gw-tree-cell">#{d.name}</div>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                        <div class="gw-slct" gw-onchange="onFilterChanged" gw-prm="#{bnPrm.PARTNER_IDS}">
                            <div><div class="gw-slct-vl"></div><div class="gw-slct-btn"></div></div>
                            <div class="gw-slct-cnt">
                                <c:forEach items="#{trdBn.partners}" var="d">
                                    <div class="gw-slct-opt gw-table-row gw-table-row-hl" gw-id="#{d.urlCode}">
                                        <div class="gw-tree-cell">#{d.name}</div>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                        <div class="gw-slct" gw-onchange="onFilterChanged" gw-prm="#{bnPrm.PERIOD_IDS}">
                            <div><div class="gw-slct-vl"></div><div class="gw-slct-btn"></div></div>
                            <div class="gw-slct-cnt">
                                <c:forEach items="#{trdBn.periods}" var="d">
                                    <div class="gw-slct-opt gw-table-row gw-table-row-hl" gw-id="#{d.urlCode}">
                                        <div class="gw-tree-cell">#{d.name}</div>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                        <div class="gw-slct" gw-onchange="onFilterChanged" gw-prm="#{bnPrm.COMMODITY_IDS}">
                            <div><div class="gw-slct-vl"></div><div class="gw-slct-btn"></div></div>
                            <div class="gw-slct-cnt">
                                <c:forEach items="#{trdBn.commodities}" var="d">
                                    <div class="gw-slct-opt gw-table-row gw-table-row-hl" gw-id="#{d.urlCode}">
                                        <div class="gw-tree-cell">(<b>#{d.code}</b>) #{d.name}</div>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                        <div class="gw-slct" gw-onchange="onFilterChanged" gw-id="#{trdBn.topPartnersRank}" gw-prm="#{bnPrm.PARTNER_RANK}">
                            <div>
                                <div class="gw-slct-vl">
                                    <div class="gw-tree-cell">#{trdBn.top}- #{trdBn.topPartnersRank} #{trdBn.partnersGenetivus}</div>
                                </div>
                                <div class="gw-slct-btn"></div>
                            </div>
                            <div class="gw-slct-cnt">
                                <c:forEach items="#{trdBn.topPartners}" var="d">
                                    <div class="gw-slct-opt gw-table-row gw-table-row-hl" gw-id="#{d}">
                                        <div class="gw-tree-cell">#{trdBn.top}- #{d} #{trdBn.partnersGenetivus}</div>
                                    </div>
                                </c:forEach>
                            </div>
                        </div>
                    </div>
                    <div style="vertical-align:top;">
                        <div style="width:2px;display:table-cell;"></div>
                        <div class="gw-graph-layout gw-sunburst" style="margin:2px;height:250px;width:230px;display:table-cell;vertical-align:top;">
                            <div id="g01title" class="gw-graph-layout-title"></div>
                            <div id="g01" class="gw-graph-layout-chart"></div>
                        </div>
                        <div style="width:2px;display:table-cell;"></div>
                        <div id="g02" class="gw-gr gw-non-selectable" gw-graph-type="bar" gw-graph-height="160" gw-onclick="onTopNClick" lang="#{trdBn.localeUrlCode}" style="height:250px;margin:2px;display:table-cell;min-width:500px;padding-left:10px;padding-right:1px;padding-top:1px;padding-bottom:1px;">
                        </div>
                    </div>
                    <div class="gw-t-cnt" gw-url-load-table="#{trdBn.tableUrl}1" style="margin:2px;min-height:400px;max-height:900px;min-width:500px;">
                        <ui:include src="/table/table.xhtml">
                            <ui:param name="#{trdBn.PARAMETER_LOCALE}" value="#{trdBn.localeUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_SECTION}" value="#{trdBn.sectionUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_REPORTER}" value="#{trdBn.reporterUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_TRADE_FLOW}" value="#{trdBn.tradeFlowUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_PARTNER}" value="#{trdBn.partnerUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_PERIOD}" value="#{trdBn.periodUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_COMMODITY_GROUP_TYPE}" value="#{trdBn.commodityGroupTypeUrlCode}"/>
                            <ui:param name="#{trdBn.PARAMETER_COMMODITY}" value="#{trdBn.commodityUrlCode}"/>
                        </ui:include>
                    </div>

                    <div style="margin:20px 0;text-align:right;">
                        <a href="#{trdBn.httpHeader}/resources/docs/trade_sources.pdf">#{trdBn.UI_TITLE_SOURCES}</a>
                    </div>

                </div>
            </div>
            <div style="display:table-row;height:4px;"></div>

        </div>
        <ui:include src="/pages.min/footer.xhtml"/>
        <div class="gw-ftr gw-ftr-bck"><p class="gw-wdth">#{trdBn.description}</p></div>
    </h:body>
</html>